<template>
    <div class="con">
        <div id="sid">
            <ul>
                <li>
                    <router-Link to="/user/profile">个人信息</Router-Link>
                </li>
                <li>
                    <router-Link to="/user/settings">用户设置</Router-Link>
                </li>
            </ul>
        </div>
        <div class="main-body">
            <RouterView></RouterView>
        </div>
    </div>
</template>
<style scoped>
.con{
    display: flex;
    height: 100%;
}
#sid{
   width: 20%;
   height: 100%;
   background: pink;
}
#sid li {
    list-style: none;
}
#sid li a {
    display: block;
    height: 40px;
    line-height: 40px;
    text-decoration: none;
    color: aquamarine;
}
#sid li a.roter-link-active {
    background: orange;
}
.main-body{
    flex: 1;
    height: 100%;
    background: deepskyblue;
}
</style>